<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="app">
    <router-link to='./home'>主页</router-link>
    <router-link to='./product'>产品详情</router-link>
    <router-view></router-view>
  </div>
</body>
<script src="./node_modules/vue/dist/vue.js"></script>
<script src="./node_modules/vue-router/dist/vue-router.js"></script>
<script>

  let routes = [
    {
      path:"/home",
      component:()=>Promise.resolve({
        template:`<h1>主页</h1>`
      })
    },
    {
      path:"/product",
      component:()=>import("./product.js")
    }
  ]

  let router = new VueRouter({
    routes
  })

  let vm = new Vue({
    router,
    el:"#app",
  })





</script>
</html>